<template>
  <div class="app-container">
    <!-- 表具档案同步按钮 -->
    <el-card class="box-card" shadow="hover" header="id同步(水表有增加时用)">
      <el-button
          type="primary"
          @click="handleSyncMeterArchive"
          :loading="loading"
          class="two-lines"
      >
        同步数据库id和盛帆网站的水表id的对应关系(表具档案接口)
      </el-button>
    </el-card>

    <!-- 自定义时间段流量数据补录 -->
    <el-card class="box-card" shadow="hover" header="自定义时间段流量数据补录(服务器掉线后用)(选择日期过多时报错是正常现象，后端在正常处理，等待一会就好)">
      <el-form inline :model="form" class="mt-4">
        <el-form-item label="时间范围">
          <el-date-picker
              v-model="form.timeRange"
              type="datetimerange"
              unlink-panels
              placeholder="['选择开始时间', '选择结束时间']"
          />
        </el-form-item>
        <el-form-item>
          <el-button
              type="success"
              @click="handleSyncMeterData"
              :loading="dataLoading"
          >
            同步水表数据
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 小时数据补处理 -->
    <el-card class="box-card" shadow="hover" header="小时数据补处理（需要往后多选一天）">
      <el-form inline :model="hourDataForm" class="mt-4">
        <el-form-item label="时间范围（可选）">
          <el-date-picker
              v-model="hourDataForm.timeRange"
              type="datetimerange"
              unlink-panels
              placeholder="['选择开始时间', '选择结束时间']"
              :clearable="true"
          />
        </el-form-item>
        <el-form-item>
          <el-button
              type="info"
              @click="handleProcessHourData"
              :loading="hourDataLoading"
          >
            处理小时数据
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 每日数据处理 -->
    <el-card class="box-card" shadow="hover" header="每日数据处理">
      <el-form inline :model="dailyDataForm" class="mt-4">
        <el-form-item label="日期范围">
          <el-date-picker
              v-model="dailyDataForm.dateRange"
              type="daterange"
              value-format="YYYY-MM-DD"
              unlink-panels
              placeholder="选择开始日期和结束日期"
              :clearable="true"
          />
        </el-form-item>
        <el-form-item>
          <el-button
              type="primary"
              @click="handleProcessDailyData"
              :loading="dailyDataLoading"
          >
            处理每日数据
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 数据分析处理（计算偏差和同比环比） -->
    <el-card class="box-card" shadow="hover" header="数据分析处理（计算偏差和同比环比）">
      <el-form inline :model="analysisForm" class="mt-4">
        <el-form-item label="日期范围">
          <el-date-picker
              v-model="analysisForm.dateRange"
              type="daterange"
              value-format="YYYY-MM-DD"
              unlink-panels
              placeholder="选择开始日期和结束日期"
              :clearable="true"
          />
        </el-form-item>
        <el-form-item>
          <el-button
              type="warning"
              @click="handleAnalyzeData"
              :loading="analysisLoading"
          >
            执行数据分析
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 生成水表告警 -->
    <el-card class="box-card" shadow="hover" header="生成水表告警">
      <el-form inline :model="warnForm" class="mt-4">
        <el-form-item label="日期范围">
          <el-date-picker
              v-model="warnForm.dateRange"
              type="daterange"
              value-format="YYYY-MM-DD"
              unlink-panels
              placeholder="选择开始日期和结束日期"
              :clearable="true"
          />
        </el-form-item>
        <el-form-item>
          <el-button
              type="danger"
              @click="handleGenerateWarnings"
              :loading="warnLoading"
          >
            生成告警数据
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 区域分析数据处理（计算区域用水统计） -->
    <el-card class="box-card" shadow="hover" header="区域分析数据处理（计算区域用水统计）">
      <el-form inline :model="areaAnalyseForm" class="mt-4">
        <el-form-item label="日期范围">
          <el-date-picker
              v-model="areaAnalyseForm.dateRange"
              type="daterange"
              value-format="YYYY-MM-DD"
              unlink-panels
              placeholder="选择开始日期和结束日期"
              :clearable="true"
          />
        </el-form-item>
        <el-form-item>
          <el-button
              type="success"
              @click="handleProcessAreaAnalyse"
              :loading="areaAnalyseLoading"
          >
            处理区域分析数据
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 区域偏差数据处理（计算区域用水偏差） -->
    <el-card class="box-card" shadow="hover" header="区域偏差数据处理（计算区域用水偏差）">
      <el-form inline :model="areaBiasForm" class="mt-4">
        <el-form-item label="日期范围">
          <el-date-picker
              v-model="areaBiasForm.dateRange"
              type="daterange"
              value-format="YYYY-MM-DD"
              unlink-panels
              placeholder="选择开始日期和结束日期"
              :clearable="true"
          />
        </el-form-item>
        <el-form-item>
          <el-button
              type="warning"
              @click="handleProcessAreaBias"
              :loading="areaBiasLoading"
          >
            处理区域偏差数据
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 新增：区域告警生成（调用后端AreaWarnController的generateByDateRange接口） -->
    <el-card class="box-card" shadow="hover" header="区域告警生成（根据日期范围生成区域告警）（不能往后多选日期）">
      <el-form inline :model="areaWarnForm" class="mt-4">
        <el-form-item label="日期范围">
          <el-date-picker
              v-model="areaWarnForm.dateRange"
              type="daterange"
              value-format="YYYY-MM-DD"
              unlink-panels
              placeholder="选择开始日期和结束日期"
              :clearable="true"
          />
        </el-form-item>
        <el-form-item>
          <el-button
              type="danger"
              @click="handleGenerateAreaWarn"
              :loading="areaWarnLoading"
          >
            生成区域告警
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 漏耗数据计算（调用后端LeakageController的calculateByDateRange接口） -->
    <el-card class="box-card" shadow="hover" header="漏耗数据计算（根据日期范围计算漏耗值和漏耗占比）">
      <el-form inline :model="leakageForm" class="mt-4">
        <el-form-item label="日期范围">
          <el-date-picker
              v-model="leakageForm.dateRange"
              type="daterange"
              value-format="YYYY-MM-DD"
              unlink-panels
              placeholder="选择开始日期和结束日期"
              :clearable="true"
          />
        </el-form-item>
        <el-form-item>
          <el-button
              type="primary"
              @click="handleCalculateLeakage"
              :loading="leakageCalculateLoading"
          >
            执行漏耗计算
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script setup>
import { ref, reactive } from "vue";
import { ElMessageBox, ElMessage } from "element-plus";
import request from '@/utils/request';

// 引入接口：水表告警（含区域告警生成接口）
import { generateMeterWarnings} from '@/api/water/meterWarn.js';
// 引入区域分析相关接口
import { processAreaAnalyse, processAreaBias } from '@/api/water/areaAnalyse.js';
import {updateAreaWarnings} from '@/api/water/areaWarn.js'
import { calculateLeakageByDateRange } from '@/api/water/leakage.js';

// ======================== 加载状态 ========================
const loading = ref(false);         // 表具档案同步加载
const dataLoading = ref(false);     // 水表数据同步加载
const hourDataLoading = ref(false); // 小时数据处理加载
const dailyDataLoading = ref(false); // 每日数据处理加载
const analysisLoading = ref(false); // 数据分析处理加载
const warnLoading = ref(false);     // 水表告警生成加载
const areaAnalyseLoading = ref(false); // 区域分析处理加载
const areaBiasLoading = ref(false); // 区域偏差处理加载
const areaWarnLoading = ref(false); // 区域告警生成加载（新增）

// 1. 加载状态（新增）
const leakageCalculateLoading = ref(false); // 漏耗计算加载

// ======================== 表单数据 ========================
// 水表数据同步表单
const form = reactive({
  timeRange: []  // 格式：[开始时间字符串, 结束时间字符串]
});

// 小时数据处理表单
const hourDataForm = reactive({
  timeRange: []
});

// 每日数据处理表单
const dailyDataForm = reactive({
  dateRange: []  // 格式：[开始日期, 结束日期]，YYYY-MM-DD
});

// 数据分析表单
const analysisForm = reactive({
  dateRange: []
});

// 水表告警生成表单
const warnForm = reactive({
  dateRange: []
});

// 区域分析数据表单
const areaAnalyseForm = reactive({
  dateRange: []
});

// 区域偏差数据表单
const areaBiasForm = reactive({
  dateRange: []
});

// 区域告警生成表单（新增）
const areaWarnForm = reactive({
  dateRange: []  // 格式：[开始日期, 结束日期]，YYYY-MM-DD
});

// 2. 漏耗计算表单（新增）
const leakageForm = reactive({
  dateRange: []  // 格式：[开始日期, 结束日期]，YYYY-MM-DD
});

// ======================== 表具档案同步 ========================
async function syncMeterArchive(pageNumber = 1, pageSize = 100) {
  try {
    const url = `/api/water/meter/sync/archiveToDb?pageNumber=${pageNumber}&pageSize=${pageSize}&type=1`;
    const response = await request({ url, method: 'post' });
    if (response.code === 200) {
      ElMessage.success(response.msg || '表具档案同步成功');
      return response;
    } else {
      throw new Error(response.msg || '同步操作失败');
    }
  } catch (error) {
    ElMessage.error(error.message || '表具档案同步失败');
    throw error;
  }
}

async function handleSyncMeterArchive() {
  try {
    await ElMessageBox.confirm(
        '确定要同步表具档案到数据库吗？请在同步前先清空数据库中t_id_correspond表的内容。',
        '同步确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
    );
    loading.value = true;
    await syncMeterArchive();
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '表具档案同步失败');
    }
  } finally {
    loading.value = false;
  }
}

// ======================== 水表数据同步 ========================
async function handleSyncMeterData() {
  const [startTime, endTime] = form.timeRange;
  // 1. 校验时间范围
  if (!startTime || !endTime) {
    ElMessage.warning('请完整选择开始时间和结束时间');
    return;
  }
  if (new Date(startTime) > new Date(endTime)) {
    ElMessage.warning('开始时间不能晚于结束时间');
    return;
  }

  try {
    await ElMessageBox.confirm(
        '确定要同步水表数据吗？当选择时间范围较大时，同步可能耗时较久，请耐心等待。时间范围不能超过一年。',
        '同步确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
    );
    dataLoading.value = true;
    const response = await request({
      url: '/api/water/meter/sync/data',
      method: 'post',
      params: { startTime, endTime }
    });
    if (response.code === 200) {
      ElMessage.success(response.msg || '水表数据同步成功');
    } else {
      throw new Error(response.msg || '水表数据同步失败');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '水表数据同步失败');
    }
  } finally {
    dataLoading.value = false;
  }
}

// ======================== 小时数据处理 ========================
async function handleProcessHourData() {
  const [startTime, endTime] = hourDataForm.timeRange;
  // 校验时间范围（可选参数，仅当有值时校验）
  if (startTime && endTime && new Date(startTime) > new Date(endTime)) {
    ElMessage.warning('开始时间不能晚于结束时间');
    return;
  }

  try {
    const confirmMessage = startTime && endTime
        ? `确定要处理 ${startTime} 至 ${endTime} 的小时数据吗？处理可能需要一定时间，请耐心等待。`
        : '确定要处理所有小时数据吗？处理可能需要较长时间，请耐心等待。';

    await ElMessageBox.confirm(
        confirmMessage,
        '处理确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'info'
        }
    );
    hourDataLoading.value = true;
    const response = await request({
      url: '/water/hourdata/process',
      method: 'post',
      params: {
        ...(startTime && { startTime }),
        ...(endTime && { endTime })
      }
    });
    if (response.code === 200) {
      ElMessage.success(response.msg || '小时数据处理成功');
    } else {
      ElMessage.warning(response.msg || '小时数据处理完成但未发现可处理的数据');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '小时数据处理失败');
    }
  } finally {
    hourDataLoading.value = false;
  }
}

// ======================== 每日数据处理 ========================
async function handleProcessDailyData() {
  const [startDate, endDate] = dailyDataForm.dateRange;
  // 1. 校验日期范围
  if (!startDate || !endDate) {
    ElMessage.warning('请完整选择开始日期和结束日期');
    return;
  }
  if (new Date(startDate) > new Date(endDate)) {
    ElMessage.warning('开始日期不能晚于结束日期');
    return;
  }

  try {
    const confirmMessage = `确定要处理 ${startDate} 至 ${endDate} 的每日数据吗？处理可能需要一定时间，请耐心等待。`;
    await ElMessageBox.confirm(
        confirmMessage,
        '处理确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'primary'
        }
    );
    dailyDataLoading.value = true;
    const response = await request({
      url: '/water/meterAnalyse/calculateDailyData',
      method: 'post',
      params: { startDate, endDate }
    });
    if (response.code === 200) {
      ElMessage.success(`每日数据处理成功，共处理 ${response.data} 条记录`);
    } else {
      ElMessage.warning(response.msg || '每日数据处理完成但未发现可处理的数据');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '每日数据处理失败');
    }
  } finally {
    dailyDataLoading.value = false;
  }
}

// ======================== 数据分析处理 ========================
async function handleAnalyzeData() {
  const [startDate, endDate] = analysisForm.dateRange;
  // 1. 校验日期范围
  if (!startDate || !endDate) {
    ElMessage.warning('请完整选择开始日期和结束日期');
    return;
  }
  if (new Date(startDate) > new Date(endDate)) {
    ElMessage.warning('开始日期不能晚于结束日期');
    return;
  }

  try {
    const confirmMessage = `确定要分析 ${startDate} 至 ${endDate} 的数据吗？此操作将计算偏差值和同比环比数据，可能需要一定时间。`;
    await ElMessageBox.confirm(
        confirmMessage,
        '分析确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
    );
    analysisLoading.value = true;
    const response = await request({
      url: '/water/meterAnalyse/analyzeMeterData',
      method: 'post',
      params: { startDate, endDate }
    });
    if (response.code === 200) {
      ElMessage.success(`数据分析完成，共处理 ${response.data} 条记录`);
    } else {
      ElMessage.warning(response.msg || '数据分析完成但未发现可处理的数据');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '数据分析失败');
    }
  } finally {
    analysisLoading.value = false;
  }
}

// ======================== 水表告警生成 ========================
async function handleGenerateWarnings() {
  const [startDate, endDate] = warnForm.dateRange;
  // 1. 校验日期范围
  if (!startDate || !endDate) {
    ElMessage.warning('请完整选择开始日期和结束日期');
    return;
  }
  if (new Date(startDate) > new Date(endDate)) {
    ElMessage.warning('开始日期不能晚于结束日期');
    return;
  }

  try {
    const confirmMessage = `确定要生成 ${startDate} 至 ${endDate} 的水表告警数据吗？此操作将根据历史数据生成告警记录，可能需要一定时间，请耐心等待。`;
    await ElMessageBox.confirm(
        confirmMessage,
        '告警生成确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'danger'
        }
    );
    warnLoading.value = true;
    const response = await generateMeterWarnings({ startDate, endDate });
    if (response.code === 200) {
      ElMessage.success(response.msg || '水表告警生成成功');
    } else {
      ElMessage.warning(response.msg || '水表告警生成完成但未发现可生成告警的数据');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '水表告警生成失败');
    }
  } finally {
    warnLoading.value = false;
  }
}

// ======================== 区域分析数据处理 ========================
async function handleProcessAreaAnalyse() {
  const [startDate, endDate] = areaAnalyseForm.dateRange;
  // 1. 校验日期范围
  if (!startDate || !endDate) {
    ElMessage.warning('请完整选择开始日期和结束日期');
    return;
  }
  if (new Date(startDate) > new Date(endDate)) {
    ElMessage.warning('开始日期不能晚于结束日期');
    return;
  }

  try {
    const confirmMessage = `确定要处理 ${startDate} 至 ${endDate} 的区域分析数据吗？此操作将计算区域用水统计数据，可能需要一定时间，请耐心等待。`;
    await ElMessageBox.confirm(
        confirmMessage,
        '区域分析处理确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'success'
        }
    );
    areaAnalyseLoading.value = true;
    const response = await processAreaAnalyse({ startDate, endDate });
    if (response.code === 200) {
      ElMessage.success(response.msg || '区域分析数据处理成功');
    } else {
      ElMessage.warning(response.msg || '区域分析数据处理完成但未发现可处理的数据');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '区域分析数据处理失败');
    }
  } finally {
    areaAnalyseLoading.value = false;
  }
}

// ======================== 区域偏差数据处理 ========================
async function handleProcessAreaBias() {
  const [startDate, endDate] = areaBiasForm.dateRange;
  // 1. 校验日期范围
  if (!startDate || !endDate) {
    ElMessage.warning('请完整选择开始日期和结束日期');
    return;
  }
  if (new Date(startDate) > new Date(endDate)) {
    ElMessage.warning('开始日期不能晚于结束日期');
    return;
  }

  try {
    const confirmMessage = `确定要处理 ${startDate} 至 ${endDate} 的区域偏差数据吗？此操作将计算区域用水偏差值，可能需要一定时间，请耐心等待。`;
    await ElMessageBox.confirm(
        confirmMessage,
        '区域偏差处理确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
    );
    areaBiasLoading.value = true;
    const response = await processAreaBias({ startDate, endDate });
    if (response.code === 200) {
      ElMessage.success(response.msg || '区域偏差数据处理成功');
    } else {
      ElMessage.warning(response.msg || '区域偏差数据处理完成但未发现可处理的数据');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '区域偏差数据处理失败');
    }
  } finally {
    areaBiasLoading.value = false;
  }
}

// ======================== 区域告警生成（新增） ========================
async function handleGenerateAreaWarn() {
  const [startDate, endDate] = areaWarnForm.dateRange;
  // 1. 校验日期范围
  if (!startDate || !endDate) {
    ElMessage.warning('请完整选择开始日期和结束日期');
    return;
  }
  if (new Date(startDate) > new Date(endDate)) {
    ElMessage.warning('开始日期不能晚于结束日期');
    return;
  }

  try {
    const confirmMessage = `确定要生成 ${startDate} 至 ${endDate} 的区域告警数据吗？此操作将根据区域分析数据生成告警（100/102/103/104类型），可能需要一定时间，请耐心等待。`;
    await ElMessageBox.confirm(
        confirmMessage,
        '区域告警生成确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'danger'
        }
    );
    areaWarnLoading.value = true;
    // 调用后端区域告警生成接口
    const response = await updateAreaWarnings({ startDate, endDate });
    if (response.code === 200) {
      ElMessage.success(response.msg || '区域告警生成成功');
    } else {
      ElMessage.warning(response.msg || '区域告警生成完成但未发现可生成告警的数据');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '区域告警生成失败');
    }
  } finally {
    areaWarnLoading.value = false;
  }
}

// 4. 漏耗计算方法（新增）
async function handleCalculateLeakage() {
  const [startDate, endDate] = leakageForm.dateRange;
  // 1. 校验日期范围
  if (!startDate || !endDate) {
    ElMessage.warning('请完整选择开始日期和结束日期');
    return;
  }
  if (new Date(startDate) > new Date(endDate)) {
    ElMessage.warning('开始日期不能晚于结束日期');
    return;
  }

  try {
    const confirmMessage = `确定要计算 ${startDate} 至 ${endDate} 的漏耗数据吗？此操作将遍历日期范围，关联多表数据计算漏耗值，可能需要一定时间，请耐心等待。`;
    await ElMessageBox.confirm(
        confirmMessage,
        '漏耗计算确认',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'primary'
        }
    );
    leakageCalculateLoading.value = true;
    // 调用漏耗计算接口
    const response = await calculateLeakageByDateRange({ startDate, endDate });
    if (response.code === 200) {
      ElMessage.success(`漏耗计算成功，共生成 ${response.data} 条漏耗记录`);
    } else {
      ElMessage.warning(response.msg || '漏耗计算完成但未发现可处理的数据');
    }
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '漏耗计算失败');
    }
  } finally {
    leakageCalculateLoading.value = false;
  }
}
</script>

<style scoped>
.two-lines {
  padding: 20px;
}
.mt-4 {
  margin-top: 16px;
}
.box-card {
  margin-bottom: 20px;
}
</style>